<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>RabbitMqProducerApplication</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">

    <!-- Javascript -->
    <script th:src="@{/jquery.min.js}"></script>
    <script th:inline="javascript">
        /*<![CDATA[*/
        //当清除缓存时会是这个样子[/;jsessionid=E6DD06F2268E7004E947863FE86FCA06]
        var path = (/*[[@{/}]]*/ +"").split(";")[0];
        /*]]>*/

        var timerId = null;

        $(function () {

        });

        function startSend(exchangeType) {
            var taskNum = $("#taskNum").val();
            var maxNum = $("#maxNum").val();
            var exchangeName = $("#exchangeName" + exchangeType).val();
            var routingKey = $("#routingKey" + exchangeType).val();
            $.post(path + "startSend", {
                taskNum: taskNum,
                maxNum: maxNum,
                exchangeName: exchangeName,
                routingKey: routingKey
            }, function (result) {
                timerId = setInterval(function () {
                    getMsgCount();
                }, 1000);
                alert(result.message);
            }, "json")
        }

        function stopSend() {
            $.post(path + "stopSend", {}, function (result) {
                if (timerId != null) {
                    clearInterval(timerId);
                    timerId = null;
                }
                alert(result.message);
            }, "json")
        }

        function getMsgCount() {
            $.post(path + "getMsgCount", {}, function (result) {
                if (result.success) {
                    var d = result.data;
                    var text = "正在发送第: " + d.noIndex + " 条消息,发送成功: <span style='color: green'>" + d.successCount +
                        "</span> ,发送失败: <span style='color: red'>" + d.failCount + "</span> ,已耗时: " + d.timeCounnt;
                    $("#sendCount").html(text);
                    if (d.sendDown) {
                        clearInterval(timerId);
                        timerId = null;
                        alert("发完完成！");
                    }
                }

            }, "json");
        }
    </script>
</head>
<body>

<div style="padding: 10px; background-color: darkgrey;">
    <h1>RabbitMq Send</h1>
    <h2>Direct Exchange</h2>
    每个 Direct Exchange 可绑定多个队列，通过指定 routingKey 来发送到那个队列，Direct 指的意思就是 routingKey 必须完全匹配，否则该消息会被抛弃
    Direct Exchange:<select id="exchangeName1">
    <option value="TestDirectExchange">TestDirectExchange</option>
</select>
    routingKey:<select id="routingKey1">
    <option value="TestDirectRouting1">TestDirectRouting1</option>
    <option value="TestDirectRouting2">TestDirectRouting2</option>
</select>
    <button onclick="startSend(1)" type="button">[Direct]开始生产消息</button>

    <hr>
    <h2>Fanout Exchange</h2>
    不处理路由键。只需要简单的将队列绑定到交换机上。一个发送到交换机的消息都会被转发到与该交换机绑定的所有队列上。
    很像子网广播，每台子网内的主机都获得了一份复制的消息。Fanout 交换机转发消息是最快的。
    <br>
    Fanout Exchange:<select id="exchangeName2">
    <option value="TestFanoutExchange">TestFanoutExchange</option>
</select>
    routingKey:<select id="routingKey2">
    <option value="">无需 routingKey</option>
</select>
    <button onclick="startSend(2)" type="button">[Fanout]开始生产消息</button>

    <hr>
    <h2>Topic Exchange</h2>
    路由键模糊匹配。符号“#”匹配一个或多个词，符号“*”匹配一个词。因此“audit.#”能够匹配到“audit.irs.corporate”，但是“audit.*” 只会匹配到“audit.irs”
    任何发送到Topic Exchange的消息都会被转发到所有关心RouteKey中指定话题的Queue上
    <br>
    Topic Exchange:<select id="exchangeName3">
        <option value="TestTopicExchange">TestTopicExchange</option>
    </select>
    routingKey:<select id="routingKey3">
    <option value="abc.wlx.def">[abc.wlx.def] TestDirectQueue1 和 TestDirectQueue1 会收到</option>
    <option value="wlx.abc.def">[abc.wlx.def] TestDirectQueue2 会收到</option>
</select>
    <button onclick="startSend(3)" type="button">[Topic]开始生产消息</button>

    <br><br>
    任务数:<input type="text" value="1000" id="taskNum"> 发送数量:<input type="text" value="100000" id="maxNum">
    <button onclick="stopSend()" id="stopBut" type="button">停止生产消息</button>
    <br>
    <span id="sendCount"></span>
</div>

</body>
</html>